<div class="toolbar"></div>
<div class="p-3">
    <div class="card mb-3">
        <h5 class="card-header">下拉查询</h5>
        <div class="card-body">
            <p class="text-muted">很多时候下拉选择并不是那么美好，如果数据过大，一次性把所有下拉选项加载明显很不合理。下拉查询采用异步请求加载的方式返回查询结果，这样做更灵活。</p>
        </div>
    </div>
    <div class="row">
        <div class="col-md-6">
            <div class="card mb-3">
                <div class="card-header bg-white">下拉搜索</div>
                <div class="card-body">
                    <div tsSearch [search]="doSearch" [(ngModel)]="values" placeholder="请选择用户" searchLabel="请输入要查询的用户昵称"></div>
                    <div class="mt-2">
                        <ts-prism language="json" [code]="values|json"></ts-prism>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="card mb-3">
                <div class="card-header bg-white">下拉搜索-单选</div>
                <div class="card-body">
                    <ts-select [searchFunc]="doSearch" [(ngModel)]="value"></ts-select>
                </div>
            </div>
        </div>
    </div>
</div>